<template>
    <div class="app-container">
        <div class="filter-container query">
            <el-form
                :model="listQuery"
                label-position="right"
                label-width="100px"
            >
                <el-row :gutter="10">
                    <el-col :xs="12" :sm="8" :lg="6">
                        <el-form-item label="企业名称" prop="companyId">
                            <el-select
                                v-model="listQuery.companyId"
                                clearable
                                filterable
                                placeholder="请选择企业"
                            >
                                <el-option
                                    v-for="item in companyOptions"
                                    :key="item.companyId"
                                    :label="item.companyName"
                                    :value="item.companyId"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="12" :sm="8" :lg="6">
                        <el-form-item label="站点名称" prop="stationId">
                            <el-select
                                v-model="listQuery.stationId"
                                clearable
                                filterable
                                placeholder="请选择站点"
                            >
                                <el-option
                                    v-for="item in stationOptions"
                                    :key="item.stationId"
                                    :label="item.stationName"
                                    :value="item.stationId"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="12" :sm="8" :lg="6">
                        <el-form-item
                            label="员工姓名"
                            prop="staffName"
                            v-show="permissionEnable"
                        >
                            <el-input
                                v-model="listQuery.staffName"
                                @keyup.enter.native="handleFilter"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :xs="12" :sm="8" :lg="6">
                        <el-form-item
                            label="用户账号"
                            prop="idNum"
                            v-show="permissionEnable"
                        >
                            <el-input
                                v-model="listQuery.idNum"
                                @keyup.enter.native="handleFilter"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :xs="12" :sm="8" :lg="6">
                        <el-form-item
                            label="手机号码"
                            prop="phoneNum"
                            v-show="permissionEnable"
                        >
                            <el-input
                                v-model="listQuery.phoneNum"
                                @keyup.enter.native="handleFilter"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :xs="12" :sm="8" :lg="6">
                        <el-form-item label="岗位" prop="post">
                            <el-select
                                v-model="listQuery.post"
                                clearable
                                class="filter-item"
                            >
                                <el-option
                                    v-for="item in postOptions"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="12" :sm="8" :lg="6">
                        <el-form-item label="启用标记" prop="enableFlag">
                            <el-select
                                v-model="listQuery.enableFlag"
                                clearable
                                class="filter-item"
                            >
                                <el-option
                                    v-for="item in enableFlagOptions"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="12" :sm="8" :lg="6">
                        <el-form-item label="删除标记" prop="delFlag">
                            <el-select
                                v-model="listQuery.delFlag"
                                clearable
                                class="filter-item"
                            >
                                <el-option
                                    v-for="item in delFlagOptions"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="24" :lg="12">
                        <el-button
                            class="filter-item"
                            type="primary"
                            size="small"
                            icon="el-icon-search"
                            @click="handleFilter"
                        >
                            搜索
                        </el-button>
                        <el-button
                            class="filter-item"
                            type="info"
                            size="small"
                            icon="el-icon-refresh"
                            @click="handleReset"
                        >
                            重置
                        </el-button>
                        <el-button
                            class="filter-item"
                            style="margin-left: 10px"
                            type="success"
                            size="small"
                            icon="el-icon-circle-plus-outline"
                            @click="handleCreate"
                        >
                            新增
                        </el-button>
                        <el-button
                            class="filter-item"
                            type="danger"
                            size="small"
                            icon="el-icon-upload"
                            @click="handleUpload"
                        >
                            导入
                        </el-button>
                        <!-- <el-button :loading="downloadLoading" class="filter-item" type="warning" size="small"
							icon="el-icon-download" @click="handleDownload">
							导出
						</el-button> -->
                    </el-col>
                </el-row>
            </el-form>
        </div>

        <el-table
            :loading="listLoading"
            :data="list"
            border
            fit
            highlight-current-row
            style="width: 100%; height: 100%"
            size="small"
            @sort-change="sortChange"
        >
            <el-table-column
                label="操作"
                align="left"
                width="225"
                class-name="small-padding fixed-width"
            >
                <template slot-scope="{ row }">
                    <el-button
                        v-if="row.delFlag === 'N'"
                        type="primary"
                        size="mini"
                        @click="handleUpdate(row)"
                        v-show="permissionEnable"
                    >
                        编辑
                    </el-button>
                    <el-button
                        v-if="row.delFlag === 'N'"
                        size="mini"
                        type="danger"
                        @click="handleDelete(row)"
                    >
                        删除
                    </el-button>
                    <el-button
                        v-if="row.delFlag === 'N'"
                        size="mini"
                        type="warning"
                        @click="handleChangeUserPasswd(row)"
                    >
                        密码
                    </el-button>
                </template>
            </el-table-column>
            <el-table-column
                label="企业名称"
                prop="companyName"
                sortable="custom"
                width="250"
                header-align="center"
                align="left"
            >
                <template slot-scope="scope">
                    <span>{{ scope.row.companyName }}</span>
                </template>
            </el-table-column>
            <el-table-column
                label="站点名称"
                prop="stationName"
                sortable="custom"
                width="200"
                header-align="center"
                align="left"
            >
                <template slot-scope="scope">
                    <span>{{ scope.row.stationName }}</span>
                </template>
            </el-table-column>
            <el-table-column
                label="员工姓名"
                prop="staffName"
                sortable="custom"
                width="150"
                header-align="center"
                align="left"
            >
                <template slot-scope="scope">
                    <span>{{ formatUserName(scope.row.staffName) }}</span>
                    <i
                        v-if="scope.row.lockFlag === 'Y'"
                        class="el-icon-lock"
                        :title="'点击为管理员' + scope.row.staffName + '解锁'"
                        @click="handleUnlock(scope.row)"
                    />
                </template>
            </el-table-column>
            <el-table-column
                label="用户账号"
                prop="idNum"
                sortable="custom"
                width="150"
                header-align="center"
                align="left"
            >
                <template slot-scope="scope">
                    <span>{{ formatCard(scope.row.idNum) }}</span>
                </template>
            </el-table-column>
            <el-table-column
                label="手机号码"
                prop="phoneNum"
                sortable="custom"
                min-width="100"
                header-align="center"
                align="left"
            >
                <template slot-scope="scope">
                    <span>{{ scope.row.phoneNum }}</span>
                </template>
            </el-table-column>
            <el-table-column
                label="岗位"
                prop="post"
                :formatter="formatter"
                sortable="custom"
                width="100"
                header-align="center"
                align="center"
            />
            <el-table-column
                label="企业员工编号"
                prop="staffNo"
                min-width="100"
                header-align="center"
                align="left"
            >
                <template slot-scope="scope">
                    <span>{{ scope.row.staffNo }}</span>
                </template>
            </el-table-column>
            <el-table-column
                label="启用标记"
                prop="enableFlag"
                :formatter="formatter"
                width="80"
                header-align="center"
                align="center"
            />
            <el-table-column
                label="删除标记"
                prop="delFlag"
                :formatter="formatter"
                width="80"
                header-align="center"
                align="center"
            />
            <el-table-column
                label="备注"
                prop="remark"
                min-width="200"
                header-align="center"
                align="left"
            >
                <template slot-scope="scope">
                    <span>{{ scope.row.remark }}</span>
                </template>
            </el-table-column>
        </el-table>

        <pagination
            v-show="total > 0"
            :total="total"
            :page.sync="listQuery.pageNo"
            :limit.sync="listQuery.pageNoSize"
            @pagination="getList"
        />

        <el-dialog
            :title="textMap[dialogStatus]"
            :visible.sync="dialogFormVisible"
            top="3vh"
            width="520px"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
            center
        >
            <el-form
                ref="dataForm"
                :rules="rules"
                :model="temp"
                label-position="right"
                label-width="120px"
                class="form-center"
            >
                <el-form-item label="企业名称" prop="companyId">
                    <el-select
                        v-model="temp.companyId"
                        clearable
                        filterable
                        placeholder="请选择企业"
                    >
                        <el-option
                            v-for="item in companyOptions"
                            :key="item.companyId"
                            :label="item.companyName"
                            :value="item.companyId"
                        />
                    </el-select>
                </el-form-item>
                <el-form-item label="岗位" prop="post">
                    <el-select v-model="temp.post" placeholder="岗位" clearable>
                        <el-option
                            v-for="item in postRealOptions"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                        />
                    </el-select>
                </el-form-item>
                <el-form-item
                    v-if="temp.post !== '企业管理员' && temp.companyType == 1"
                    label="站点名称"
                    prop="stationId"
                >
                    <el-select
                        v-model="temp.stationId"
                        clearable
                        filterable
                        placeholder="请选择站点"
                    >
                        <el-option
                            v-for="item in stationOptions"
                            :key="item.stationId"
                            :label="item.stationName"
                            :value="item.stationId"
                        />
                    </el-select>
                </el-form-item>
                <el-form-item label="员工姓名" prop="staffName">
                    <el-input v-model="temp.staffName" maxlength="128" />
                </el-form-item>
                <el-form-item label="用户账号" prop="idNum">
                    <el-input v-model="temp.idNum" maxlength="32" />
                </el-form-item>
                <el-form-item label="手机号码" prop="phoneNum">
                    <el-input v-model="temp.phoneNum" maxlength="32" />
                </el-form-item>
                <el-form-item label="企业员工编号" prop="staffNo">
                    <el-input v-model="temp.staffNo" maxlength="32" />
                </el-form-item>
                <el-form-item label="启用标记" prop="enableFlag">
                    <el-select
                        v-model="temp.enableFlag"
                        placeholder="启用标记"
                        clearable
                    >
                        <el-option
                            v-for="item in enableFlagOptions"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                        />
                    </el-select>
                </el-form-item>
                <el-form-item label="备注" prop="remark">
                    <el-input v-model="temp.remark" maxlength="128" />
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false"> 取消 </el-button>
                <el-button
                    type="primary"
                    :loading="formSubmiting"
                    @click="
                        dialogStatus === 'create' ? createData() : updateData()
                    "
                >
                    确认
                </el-button>
            </div>
        </el-dialog>

        <el-dialog
            title="Excel导入员工信息"
            :visible.sync="uploadExcelDialogVisible"
            center
        >
            <div class="app-container">
                <el-form
                    ref="dataForm"
                    :rules="rules"
                    :model="uploadTemp"
                    label-position="right"
                    label-width="70px"
                    fit
                >
                    <el-row :gutter="10">
                        <el-col :xs="24" :sm="12">
                            <el-form-item label="企业名称" prop="companyId">
                                <el-select
                                    v-model="uploadTemp.companyId"
                                    clearable
                                    filterable
                                    placeholder="请选择企业"
                                >
                                    <el-option
                                        v-for="item in companyOptions"
                                        :key="item.companyId"
                                        :label="item.companyName"
                                        :value="item.companyId"
                                    />
                                </el-select>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
                <el-upload
                    ref="upload"
                    action="customized"
                    :limit="1"
                    accept=".xls,.xlsx"
                    :http-request="handleExcelUpload"
                    :auto-upload="false"
                >
                    <el-button slot="trigger" size="small" type="primary"
                        >选取文件</el-button
                    >
                    <el-button
                        :loading="fileUploading"
                        style="margin-left: 10px"
                        size="small"
                        type="success"
                        @click="submitUpload"
                        >上传到服务器</el-button
                    >
                    <el-button
                        style="margin-left: 10px"
                        size="small"
                        type="info"
                        @click="handleDownloadTemplate"
                        >下载模板</el-button
                    >
                    <div slot="tip" class="el-upload__tip">
                        只能上传xls/xlsx文件
                    </div>
                </el-upload>
            </div>
        </el-dialog>

        <el-dialog
            title="员工密码修改"
            :visible.sync="dialogPasswdFormVisible"
            :modal-append-to-body="false"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
            center
            :destroy-on-close="true"
            width="500px"
        >
            <el-form
                ref="dataPasswdForm"
                :rules="rules"
                :model="tempPasswd"
                label-position="right"
                label-width="150px"
                class="form-center"
            >
                <el-form-item prop="newpasswd" class="form-item-center">
                    <el-radio v-model="tempPasswd.passType" label="1"
                        >手动输入</el-radio
                    >
                    <el-radio v-model="tempPasswd.passType" label="2"
                        >随机密码</el-radio
                    >
                    <el-radio v-model="tempPasswd.passType" label="3"
                        >默认密码</el-radio
                    >
                </el-form-item>
                <el-form-item label="新的密码" prop="newpasswd">
                    <el-input
                        v-if="tempPasswd.passType === '1'"
                        v-model="tempPasswd.newpasswd"
                        minlength="8"
                        maxlength="64"
                        placeholder="新员工密码"
                        show-password
                    />
                    <span
                        v-if="tempPasswd.passType !== '1'"
                        style="color: red"
                        >{{ tempPasswd.newpasswd }}</span
                    >
                </el-form-item>
                <el-form-item
                    v-if="tempPasswd.passType === '1'"
                    label="验证密码"
                    prop="repasswd"
                >
                    <el-input
                        v-model="tempPasswd.repasswd"
                        minlength="8"
                        maxlength="64"
                        placeholder="确认员工密码"
                        show-password
                    />
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogPasswdFormVisible = false">
                    取消
                </el-button>
                <el-button
                    :loading="formSubmiting"
                    type="primary"
                    @click="changeUserPasswd"
                >
                    确认
                </el-button>
            </div>
        </el-dialog>
        <waterMark :content="markContent"></waterMark>
    </div>
</template>

<script>
    import {
        getStaffList,
        deleteStaffInfo,
        unlockStaff,
        changePasswd,
        createStaffInfo,
        updateStaffInfo,
        exportStaffInfoTemplate,
        exportStaffInfo,
        importStaffInfo,
        getUserInfo,
    } from "@/api/smsk/staffInfo";
    import Pagination from "@/components/Pagination"; // secondary package based on el-pagination
    import waterMark from "@/components/waterMark";
    import { saveRespExcel } from "@/utils";
    import { setOptionData, valueFormate } from "@/utils/dict";
    import { selectCompanyList } from "@/api/smsk/company";
    import { selectStationList } from "@/api/smsk/station";
    import { getCaptchaw150h40 } from "@/api/base/common";
    import { encryptSM2, decryptSM4 } from "@/utils/sm-crypto.js";
    import { getUserInfo as getUserCode } from "@/api/user";

    export default {
        name: "SmskStaffInfo",
        components: {
            Pagination,
            waterMark,
        },
        data() {
            const validateNewpasswd = (rule, value, callback) => {
                if (value == null || value.length > 64 || value.length < 1) {
                    callback(
                        new Error(
                            "密码应为长度为8至64个字符的满足总行要求的数字、字母、特殊字符组合"
                        )
                    );
                }
                var reg = new RegExp(/^(?![^a-zA-Z]+$)(?!\D+$)/);
                if (reg.test(value)) {
                    callback();
                } else {
                    callback(
                        new Error(
                            "密码应为长度为8至64个字符的满足总行要求的数字、字母、特殊字符组合"
                        )
                    );
                }
            };
            const validateRepasswd = (rule, value, callback) => {
                if (value == null || value.length > 64 || value.length < 1) {
                    callback(
                        new Error(
                            "密码应为长度为8至64个字符的满足总行要求的数字、字母、特殊字符组合"
                        )
                    );
                }
                if (value === this.tempPasswd.newpasswd) {
                    callback();
                } else {
                    callback(new Error("两次输入密码不一致"));
                }
            };
            return {
                permissionEnable: false,
                list: [],
                unselectRoles: [],
                selectedRoles: [],
                dialogTransferVisible: false,
                uploadExcelDialogVisible: false,
                dialogPasswdFormVisible: false,
                selectedUserId: null,
                userTypeOptions: [],
                enableFlagOptions: [],
                delFlagOptions: [],
                companyOptions: [],
                stationOptions: [],
                companyTypeOptions: [],
                postRealOptions: [],
                postOptions: [],
                postOptions_2: [], //清分公司公司岗位
                total: 0,
                listLoading: false,
                listQuery: {
                    pageNo: 1,
                    pageSize: 20,
                    sortField: undefined,
                    sortOrder: undefined,
                    companyId: null,
                    stationId: null,
                    staffName: "",
                    post: "",
                    phoneNum: "",
                    enableFlag: "",
                    companyType: "",
                    timestamp: "",
                },
                temp: {
                    id: null,
                    idType: "01",
                    companyId: "",
                    stationId: "",
                    staffName: "",
                    phoneNum: "",
                    post: "",
                    staffNo: "",
                    idNum: "",
                    remark: "",
                    enableFlag: "Y",
                    companyType: 2,
                    timestamp: "",
                },
                tempPasswd: {
                    passType: "1",
                    id: "",
                    newpasswd: "",
                    repasswd: "",
                },
                dialogFormVisible: false,
                dialogStatus: "",
                textMap: {
                    update: "更新员工信息",
                    create: "创建员工信息",
                },
                dialogPvVisible: false,
                pvData: [],
                rules: {
                    post: [
                        {
                            required: true,
                            message: "岗位不能为空",
                            trigger: "change",
                        },
                    ],
                    companyId: [
                        {
                            required: true,
                            message: "企业不能为空",
                            trigger: "change",
                        },
                    ],
                    stationId: [
                        {
                            required: true,
                            message: "站点不能为空",
                            trigger: "change",
                        },
                    ],
                    phoneNum: [
                        {
                            required: true,
                            max: 256,
                            message: "员工手机最大长度为256个字符",
                            trigger: "change",
                        },
                    ],
                    staffName: [
                        {
                            required: true,
                            max: 256,
                            message: "员工姓名最大长度为256个字符",
                            trigger: "change",
                        },
                    ],
                    idNum: [
                        {
                            required: true,
                            max: 256,
                            message: "用户账号最大长度不能超过256个字符",
                            trigger: "change",
                        },
                    ],
                    enableFlag: [
                        {
                            required: true,
                            message: "启用标记不能为空",
                            trigger: "change",
                        },
                    ],
                    newpasswd: [
                        {
                            required: true,
                            message: "新的密码不能为空",
                            trigger: "change",
                        },
                        {
                            min: 8,
                            max: 64,
                            message:
                                "密码应为长度为8至64个字符的满足总行要求的数字、字母、特殊字符组合",
                            trigger: "change",
                        },
                        {
                            validator: validateNewpasswd,
                            message:
                                "密码应为长度为8至64个字符的满足总行要求的数字、字母、特殊字符组合",
                            trigger: "change",
                        },
                    ],
                    repasswd: [
                        {
                            required: true,
                            message: "请验证新的密码",
                            trigger: "change",
                        },
                        {
                            min: 8,
                            max: 64,
                            message: "两次输入密码不一致",
                            trigger: "change",
                        },
                        {
                            validator: validateRepasswd,
                            message: "两次输入密码不一致",
                            trigger: "change",
                        },
                    ],
                },
                downloadLoading: false,
                fileUploading: false,
                uploadTemp: {
                    companyId: null,
                },
                formSubmiting: false,
                captcha: {},
                markContent: "",
            };
        },
        watch: {
            "listQuery.companyId": function (newVal, oldVal) {
                console.log("listQuery");
                if (newVal) {
                    this.getStationList(newVal);
                }
            },
            "temp.post": function (newVal, oldVal) {
                console.log(newVal);
                if (newVal === "企业管理员") {
                    this.temp.stationId = 0;
                }
            },
            "temp.companyId": function (newVal, oldVal) {
                console.log("temp");
                var list = this.companyOptions;
                for (var i = 0; i < list.length; i++) {
                    if (list[i].companyId == newVal) {
                        if (list[i].companyType == "1") {
                            this.postRealOptions = this.postOptions;
                        } else if (list[i].companyType == "2") {
                            this.postRealOptions = this.postOptions_2;
                        }
                        this.temp.companyType = list[i].companyType;
                        break;
                    }
                }
                if (newVal) {
                    this.getStationList(newVal);
                }
            },
            "tempPasswd.passType": function (val, oldVal) {
                if (val === "1") {
                    this.tempPasswd.newpasswd = "";
                    this.tempPasswd.repasswd = "";
                } else if (val === "2") {
                    // 生成随机密码
                    const passAlpha = [
                        "a",
                        "b",
                        "c",
                        "d",
                        "e",
                        "f",
                        "g",
                        "h",
                        "i",
                        "j",
                        "k",
                        "l",
                        "m",
                        "n",
                        "o",
                        "p",
                        "q",
                        "r",
                        "s",
                        "t",
                        "u",
                        "v",
                        "w",
                        "x",
                        "y",
                        "z",
                        "A",
                        "B",
                        "C",
                        "D",
                        "E",
                        "F",
                        "G",
                        "H",
                        "I",
                        "J",
                        "K",
                        "L",
                        "M",
                        "N",
                        "O",
                        "P",
                        "Q",
                        "R",
                        "S",
                        "T",
                        "U",
                        "V",
                        "W",
                        "X",
                        "Y",
                        "Z",
                    ];
                    const passNumber = [
                        "0",
                        "1",
                        "2",
                        "3",
                        "4",
                        "5",
                        "6",
                        "7",
                        "8",
                        "9",
                    ];
                    const passDot = ["&", "!", "*", "#", "@", "(", ")", "="];
                    const passwdLen = 8;
                    let password = "";
                    for (var i = 0; i < passwdLen; i++) {
                        if (i % 3 === 0) {
                            const x = Math.floor(Math.random() * passAlpha.length);
                            password += passAlpha[x];
                        } else if (i % 3 === 1) {
                            const x = Math.floor(Math.random() * passDot.length);
                            password += passDot[x];
                        } else {
                            const x = Math.floor(Math.random() * passNumber.length);
                            password += passNumber[x];
                        }
                    }
                    this.tempPasswd.newpasswd = password;
                    this.tempPasswd.repasswd = password;
                } else {
                    const password = "SM_4-1%3sk";
                    this.tempPasswd.newpasswd = password;
                    this.tempPasswd.repasswd = password;
                }
                this.$nextTick(() => {
                    this.$refs["dataPasswdForm"].clearValidate();
                });
            },
        },
        created() {
            // this.$store.state.user.userInfo.userName = response.data.userName
            // this.$store.state.user.userInfo.userPhone = response.data.userPhone
            // this.$store.state.user.userInfo.userEmail = response.data.userEmail
            // this.$store.state.user.userInfo.userAvatar = response.data.userAvatar
            this.markContent = this.$store.state.user.userInfo.userName;
            this.initDictInfos();
            this.getList();
            this.genCaptcha();

            getUserCode()
                .then((response) => {
                    const { data } = response;
                    if (!data) {
                        reject("获取用户信息为空，请联系管理员");
                    }
                    const { roles, permissions, userInfo } = data;
                    if (userInfo.userCode == "admin") this.permissionEnable = true;
                    else this.permissionEnable = false;
                    console.log(this.permissionEnable);
                    resolve(data);
                })
                .catch((error) => {
                    reject(error);
                });
        },
        methods: {
            formatCard(val) {
                if (!val) return "";
                let reg = /^(.{3}).*(.{4})$/;
                return val.replace(reg, "$1***********$2");
            },

            formatUserName(val) {
                if (!val || val === "") return "";
                let name = "";
                if (val.length === 2) {
                    name = val.substring(0, 1) + "*"; // 截取name 字符串截取第一个字符，
                } else if (val.length > 2) {
                    name = val.substring(0, 2); // 大于2个字只显示前两个字
                    for (let i = 0; i < val.length - 2; i++) {
                        name = name + "*";
                    }
                }
                return name;
            },
            initDictInfos() {
                // 初始化数据字典
                // 加载下拉数据
                const optionsMap = new Map();
                optionsMap.set("BASE_USER_TYPE", this.userTypeOptions);
                optionsMap.set("ENABLE_FLAG", this.enableFlagOptions);
                optionsMap.set("YES_OR_NO", this.delFlagOptions);
                optionsMap.set("SMSK_POST", this.postOptions);
                optionsMap.set("SMSK_POST_THIRD", this.postOptions_2);
                optionsMap.set("BASE_COMPANY_TYPE", this.companyTypeOptions);
                setOptionData(optionsMap);
                selectCompanyList().then((res) => {
                    this.companyOptions = res.data;
                });
            },
            getStationList(companyId) {
                selectStationList(companyId).then((res) => {
                    this.stationOptions = res.data;
                });
            },
            formatter(row, column, cellValue, index) {
                return valueFormate(this, column.property, cellValue);
            },
            getList() {
                this.listLoading = true;
                const key = "4f39f20ec1fd479fa6dc3fd2d353d47d";
                let timestamp = Date.parse(new Date());
                timestamp = timestamp / 1000;
                this.listQuery.timestamp = timestamp;
                getStaffList(this.listQuery).then((response) => {
                    console.log(response);
                    this.list = response.data;
                    this.list.forEach((item) => {
                        item.idNum = decryptSM4(item.idNum, key);
                        item.staffName = decryptSM4(item.staffName, key);
                        item.phoneNum = decryptSM4(item.phoneNum, key);
                    });
                    this.total = response.total;
                    this.listLoading = false;
                });
            },
            handleFilter() {
                this.listQuery.pageNo = 1;
                this.getList();
            },
            handleReset() {
                this.listQuery = {
                    pageNo: 1,
                    pageSize: 20,
                    sortField: undefined,
                    companyId: null,
                    stationId: null,
                    staffName: "",
                    post: "",
                    phoneNum: "",
                    enableFlag: "",
                };
            },
            handleModifyStatus(row, status) {
                this.$message({
                    message: "Success",
                    type: "success",
                });
            },
            resetTemp() {
                this.temp = {
                    id: null,
                    idType: "01",
                    companyId: "",
                    stationId: "",
                    staffName: "",
                    phoneNum: "",
                    post: "",
                    staffNo: "",
                    idNum: "",
                    remark: "",
                    enableFlag: "Y",
                    companyType: "",
                };
            },
            handleCreate() {
                this.resetTemp();
                this.dialogStatus = "create";
                this.dialogFormVisible = true;
                this.$nextTick(() => {
                    this.$refs["dataForm"].clearValidate();
                });
                this.genCaptcha();
            },
            createData() {
                this.$refs["dataForm"].validate((valid) => {
                    if (valid) {
                        this.formSubmiting = true;
                        this.temp.idNum = encryptSM2(
                            this.temp.idNum,
                            this.captcha.publicKey
                        );
                        this.temp.staffName = encryptSM2(
                            this.temp.staffName,
                            this.captcha.publicKey
                        );
                        this.temp.phoneNum = encryptSM2(
                            this.temp.phoneNum,
                            this.captcha.publicKey
                        );
                        let timestamp = Date.parse(new Date());
                        timestamp = timestamp / 1000;
                        this.temp.timestamp = timestamp;
                        createStaffInfo(this.temp).then(
                            (response) => {
                                this.formSubmiting = false;
                                this.dialogFormVisible = false;
                                this.getList();
                                this.$message({
                                    message: "员工信息保存成功!",
                                    type: "success",
                                });
                            },
                            () => {
                                this.formSubmiting = false;
                            }
                        );
                    }
                });
            },
            handleUpdate(row) {
                console.log(row.id);
                const key = "4f39f20ec1fd479fa6dc3fd2d353d47d";
                let timestamp = Date.parse(new Date());
                timestamp = timestamp / 1000;
                let params = {
                    id: row.id,
                    timestamp: timestamp,
                };
                getUserInfo(params).then((res) => {
                    this.temp = Object.assign(this.temp, res.data);
                    this.temp.idNum = decryptSM4(this.temp.idNum, key);
                    this.temp.staffName = decryptSM4(this.temp.staffName, key);
                    this.temp.phoneNum = decryptSM4(this.temp.phoneNum, key);
                });
                // copy obj
                this.dialogStatus = "update";
                this.dialogFormVisible = true;
                this.$nextTick(() => {
                    this.$refs["dataForm"].clearValidate();
                });
                this.genCaptcha();
            },
            handleDelete(row) {
                this.$msgbox({
                    type: "warning",
                    title: "确认",
                    message: "确认删除员工[" + row.staffName + "]?",
                    showCancelButton: true,
                    showClose: false,
                    closeOnPressEscape: false,
                    closeOnClickModal: false,
                    confirmButtonText: "确认",
                    cancelButtonText: "取消",
                    beforeClose: (action, instance, done) => {
                        if (action === "confirm") {
                            instance.confirmButtonLoading = true;
                            let timestamp = Date.parse(new Date());
                            timestamp = timestamp / 1000;
                            let queryParams = {
                                staffId: row.id,
                                timestamp: timestamp,
                            };
                            deleteStaffInfo(queryParams).then(
                                (response) => {
                                    this.getList();
                                    this.$message({
                                        message:
                                            "员工[" + row.staffName + "]删除成功!",
                                        type: "success",
                                    });
                                    done();
                                    instance.confirmButtonLoading = false;
                                },
                                (response) => {
                                    done();
                                    instance.confirmButtonLoading = false;
                                }
                            );
                        } else {
                            done();
                        }
                    },
                });
            },
            sortChange(data) {
                const { prop, order } = data;
                this.sortByField(prop, order);
            },
            sortByField(prop, order) {
                if (order === "ascending") {
                    this.listQuery.sortField = prop;
                    this.listQuery.sortOrder = "asc";
                } else if (order === "descending") {
                    this.listQuery.sortField = prop;
                    this.listQuery.sortOrder = "desc";
                } else {
                    this.listQuery.sortField = undefined;
                    this.listQuery.sortOrder = undefined;
                }
                this.handleFilter();
            },
            updateData() {
                this.$refs["dataForm"].validate((valid) => {
                    if (valid) {
                        this.formSubmiting = true;
                        this.temp.idNum = encryptSM2(
                            this.temp.idNum,
                            this.captcha.publicKey
                        );
                        this.temp.staffName = encryptSM2(
                            this.temp.staffName,
                            this.captcha.publicKey
                        );
                        this.temp.phoneNum = encryptSM2(
                            this.temp.phoneNum,
                            this.captcha.publicKey
                        );
                        let timestamp = Date.parse(new Date());
                        timestamp = timestamp / 1000;
                        this.temp.timestamp = timestamp;
                        updateStaffInfo(this.temp).then(
                            () => {
                                this.formSubmiting = false;
                                this.getList();
                                this.dialogFormVisible = false;
                                this.$message({
                                    message: "员工信息更新成功!",
                                    type: "success",
                                });
                            },
                            () => {
                                this.formSubmiting = false;
                            }
                        );
                    }
                });
            },
            submitUpload() {
                this.$refs.upload.submit();
            },
            handleUpload() {
                this.uploadExcelDialogVisible = true;
                this.uploadTemp = {
                    companyId: null,
                };
            },
            handleExcelUpload(file) {
                if (!file || !file.file) {
                    return function () {
                        Promise.resolve(file);
                    };
                }
                console.log(this.uploadTemp);
                this.fileUploading = true;
                importStaffInfo(file, this.uploadTemp).then(
                    (response) => {
                        this.getList();
                        this.$message({
                            message: "批量导入员工信息成功!",
                            type: "success",
                        });
                        this.uploadExcelDialogVisible = false;
                        this.fileUploading = false;
                    },
                    (response) => {
                        this.fileUploading = false;
                    }
                );
            },
            handleDownload() {
                this.downloadLoading = true;
                exportStaffInfo(this.listQuery).then(
                    (response) => {
                        saveRespExcel(response);
                        this.downloadLoading = false;
                    },
                    (response) => {
                        this.downloadLoading = false;
                    }
                );
            },
            handleDownloadTemplate() {
                this.downloadLoading = true;
                exportStaffInfoTemplate().then(
                    (response) => {
                        saveRespExcel(response);
                        this.downloadLoading = false;
                    },
                    (response) => {
                        this.downloadLoading = false;
                    }
                );
            },
            handleUnlock(row) {
                this.$msgbox({
                    type: "warning",
                    title: "确认",
                    message: "确认解锁员工[" + row.staffName + "]?",
                    showCancelButton: true,
                    showClose: false,
                    closeOnPressEscape: false,
                    closeOnClickModal: false,
                    confirmButtonText: "确认",
                    cancelButtonText: "取消",
                    beforeClose: (action, instance, done) => {
                        if (action === "confirm") {
                            instance.confirmButtonLoading = true;
                            unlockStaff(row.id).then(
                                (response) => {
                                    this.getList();
                                    this.$message({
                                        message:
                                            "员工[" + row.staffName + "]解锁成功!",
                                        type: "success",
                                    });
                                    done();
                                    instance.confirmButtonLoading = false;
                                },
                                (response) => {
                                    done();
                                    instance.confirmButtonLoading = false;
                                }
                            );
                        } else {
                            done();
                        }
                    },
                });
            },
            handleChangeUserPasswd(row) {
                this.tempPasswd = {
                    passType: "1",
                    id: row.id,
                    newpasswd: "",
                    repasswd: "",
                };
                this.$nextTick(() => {
                    this.$refs["dataPasswdForm"].clearValidate();
                });
                this.dialogPasswdFormVisible = true;
                this.genCaptcha();
            },
            changeUserPasswd() {
                this.$refs["dataPasswdForm"].validate((valid) => {
                    if (valid) {
                        this.formSubmiting = true;
                        const params = {
                            id: this.tempPasswd.id,
                            newPasswd: encryptSM2(
                                this.tempPasswd.newpasswd,
                                this.captcha.publicKey
                            ),
                            captchaId: this.temp.captchaId,
                        };
                        changePasswd(params).then(
                            () => {
                                this.formSubmiting = false;
                                this.dialogPasswdFormVisible = false;
                                this.$message({
                                    message: "员工密码修改成功!",
                                    type: "success",
                                });
                            },
                            () => {
                                this.formSubmiting = false;
                            }
                        );
                    }
                });
            },
            genCaptcha() {
                getCaptchaw150h40().then(
                    (response) => {
                        this.captcha.captchHash = response.data.hashCode;
                        this.captcha.publicKey = response.data.publicKey;
                        this.temp.captcha = "";
                        this.temp.captchaId = response.data.captchaId;
                    },
                    (response) => {
                        console.log(response);
                    }
                );
            },
        },
    };
</script>